<template>
  <van-nav-bar
    title="注册"
    left-text="返回"
    left-arrow
    @click-left="onClickLeft"
  />

  <van-form @submit="onSubmit">
    <van-cell-group inset>
      <van-field
        v-model="mobileNum"
        name="手机号码"
        label="用户名"
        placeholder="手机号码"
        :rules="[{ required: true, message: '请填写手机号码' }]"
      />
    </van-cell-group>
    <div style="margin: 16px">
      <van-button
        round
        block
        type="primary"
        native-type="submit"
        :disabled="isDisabled"
      >
        下一步
      </van-button>
    </div>
  </van-form>
</template>

<script>
import { showToast } from "vant";
import { getRegisterDataApi } from "@/api/my.js";
export default {
  name: "Login",
  data() {
    return {
      mobileNum: "",
      loginRegExp: /^1[3-9]\d{9}$/,
      isDisabled: true,
    };
  },
  methods: {
    onClickLeft() {
      this.$router.back(-1);
    },
    onSubmit() {
      // this.$router.push("/Login")
      this.getRegisterData();
    },
    // 号码是否被注册
    async getRegisterData() {
      let res = await getRegisterDataApi({
        tel: this.mobileNum,
      });
      if (res.data.code == 200) {
        sessionStorage.setItem("tel", this.mobileNum);
        this.$router.push({ path: "/Code" });
      } else {
        showToast("对不起，你输入的手机号码已经被注册!");
      }
    },
  },
  watch: {
    mobileNum(newVal) {
      if (this.loginRegExp.test(newVal)) {
        this.isDisabled = false;
      } else {
        this.isDisabled = true;
      }
    },
  },
};
</script>

<style scoped></style>
